<template>
  <div>
    <div v-wechat-title="$route.meta.title"></div>
    <el-breadcrumb separator="/">
      <el-breadcrumb-item>首页</el-breadcrumb-item>
      <el-breadcrumb-item>订单</el-breadcrumb-item>
      <el-breadcrumb-item>订单列表</el-breadcrumb-item>
    </el-breadcrumb>
    <template>
      <el-card class="box-card">
        <el-row>
          <el-col :span="1">
            <el-button
              icon="el-icon-refresh-left"
              @click="refreshdata()"
            ></el-button>
          </el-col>
        </el-row>
        <transition name="el-zoom-in-center">
          <el-table
            :data="datalist"
            height="500"
            border
            style="width: 100%; margin-top: 15px"
            v-show="show"
          >
            <el-table-column type="index" label="#"> </el-table-column>
            <el-table-column
              prop="ordernum"
              label="订单号"
              width="90"
            ></el-table-column>
            <el-table-column
              prop="usernike"
              label="下单用户"
              width="150"
            ></el-table-column>
            <el-table-column prop="goods" label="商品"></el-table-column>
            <el-table-column prop="total" label="总价"></el-table-column>
            <el-table-column
              prop="createtime"
              label="下单时间"
            ></el-table-column>
            <el-table-column prop="ishot" label="状态" width="90">
              <template slot-scope="scope">
                <el-tag v-if="scope.row.issend == '1'" type="success">
                  已发货
                </el-tag>
                <el-tag v-else> 未发货 </el-tag>
              </template>
            </el-table-column>
            <el-table-column label="操作" width="90">
              <template slot-scope="scope">
                <el-button type="primary" @click="sendgood(scope.row.id)" size="mini"
                  >发货</el-button
                >
              </template>
            </el-table-column>
          </el-table>
        </transition>
      </el-card>
    </template>
  </div>
</template>

<script>
export default {
  data() {
    return {
      show: false,
      datalist: [],
    };
  },
  created() {
    this.getdata();
  },
  mounted() {
    this.show = !this.show;
  },
  methods: {
    getdata() {
      this.$http
        .get("busgetorders", {
          params: {
            token: window.sessionStorage.getItem("token"),
            busid: window.sessionStorage.getItem("busid"),
          },
        })
        .then((res) => {
          if (res.data.code == 200) {
            this.datalist = res.data.data;
          } else {
            this.$Message.error("获取数据失败！");
          }
        })
        .catch((err) => {
          this.$Message.error("系统出错！" + err);
        });
    },
    refreshdata() {
      this.$Message.success("刷新成功");
      this.getdata();
    },
    sendgood(id) {
      this.$confirm("此操作将发货该订单, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          let params = new URLSearchParams();
          params.append("token", window.sessionStorage.getItem("token"));
          params.append("id", id);
          this.$http
            .post("sendgood", params)
            .then((res) => {
              if (res.data.code == 200) {
                this.$Message.success("发货成功");
                this.getdata();
              } else {
                this.$Message.error("发货失败");
              }
            })
            .catch((err) => {
              this.$Message.error("系统错误!" + err);
            });
        })
        .catch(() => {
          this.$Message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
  },
};
</script>

<style scoped>
.box-card {
  margin-top: 30px;
  width: 480ox;
}
</style>
